<template>
	<div class="page-wrap">
		<div class="page-inner">
			<div class="page-ctx-wrap">
				<el-tabs v-model="activeName" @tab-click="handleClick">
					<el-tab-pane label="开发信息" name="开发信息">
						<div class="panel-item" data-title="开发信息">
							<div class="section-title">开发信息</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">会员升级方式</div>
									<div class="val">
										<el-radio-group v-model="form.levelUp" class="column">
											<el-radio :label="0">手动升级</el-radio>
											<el-radio :label="1">累计消费</el-radio>
											<el-radio :label="2">累计积分</el-radio>
										</el-radio-group>
									</div>
								</div>
							</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label ">注：</div>
									<div class="val">
										<div class="input-tip">请不要轻易切换该按钮，容易引发异常操作。<br /></div>
									</div>
								</div>
							</div>
						</div>
					</el-tab-pane>
					<el-tab-pane label="版本信息" name="版本信息">
						<div class="panel-item" data-title="版本信息">
							<div class="section-title">版本信息</div>
							<div class="input-item">
								<div class="input-box">
									<div class="label">系统版本号</div>
									<div class="val">
										<el-input clearable="" v-model="form.webVersion" placeholder="">
										</el-input>
									</div>
								</div>
							</div>

							<div class="input-item" v-if="IS_MAIN_PACKAGE">
								<div class="input-box">
									<div class="label">最新代码包地址</div>
									<div class="val">
										<el-input clearable="" v-model="form.webUrl" placeholder="">
										</el-input>
									</div>
								</div>
							</div>


							<div class="input-item" v-if="!IS_MAIN_PACKAGE">
								<div class="input-box">
									<div class="label">同步代码</div>
									<div class="val">
										<el-button type="primary" @click="update_main_project_code()">同步代码</el-button>
									</div>
								</div>
							</div>


							<div class="input-item">
								<div class="input-box">
									<div class="label ">注：</div>
									<div class="val">
										<div class="input-tip">确认更新代码操作？请谨慎思考操作的必要性。<br /></div>
									</div>
								</div>
							</div>

						</div>
					</el-tab-pane>


				</el-tabs>
			</div>
		</div>

		<div class="footer-actions">
			<el-button type="primary" @click="doSubmit()"> 保存 </el-button>
		</div>

	</div>
</template>

<script>
import {
	IS_MAIN_PACKAGE
} from '@/config/env.js'

import {
	mapState
} from "vuex";
export default {
	name: "news",
	components: {},
	data() {
		return {
			IS_MAIN_PACKAGE,

			activeName: "开发信息",
			form: {
				levelUp: "",
				webVersion: "",
				webUrl: "",
			},
		};
	},
	computed: {},
	watch: {},
	created() {
		this.setView();
	},
	mounted() { },
	methods: {
		setView() {
			this.$api({
				url: '/admin_service.php',
				method: "get",
				data: {
					action: "setting_getConfig",
				},
			}).then((res) => {
				let data = res.data;
				if (res.code == 200) {
					this.info = data;
					this.form = {
						levelUp: data.levelUp || "",
						webVersion: data.webVersion || "",
						webUrl: data.webUrl || "",
					};
				}
			});
		},
		handleClick(tab, event) {
			console.log(tab, event);
		},

		doSubmit() {
			this.$api({
				url: '/admin_service.php',
				method: "get",
				data: {
					action: "setting_setConfig",
					...this.form,
				},
			}).then((res) => {
				alert(res);
			});
		},

		//
		update_main_project_code() {
			this.$confirm('确认同步最新代码到当前项目，此操作可能因接口或数据库字段不匹配导致报错，请谨慎处理?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				this.update_main_project_code_confirm()
			}).catch(() => {

			});
		},

		//更新代码
		update_main_project_code_confirm() {
			this.showLoading()
			this.$api({
				url: '/admin_service.php',
				method: "get",
				data: {
					action: "setting_updateWeb",
				},
			}).then((res) => {
				if (res.code == 200) {
					this.setView()
					this.$message({
						message: res.msg,
						type: 'success'
					})
				} else {
					alertErr(res.msg)
				}

				this.hideLoading()
			});
		}
	},
};
</script>

<style scoped lang="less">
/deep/ .upload-image .el-upload {
	width: 100px;
	height: 100px;
	line-height: 98px;
}

/deep/ .upload-video .el-upload {
	width: 100px;
	height: 100px;
	line-height: 98px;

	background-color: #fbfdff;
	border: 1px dashed #c0ccda;
	border-radius: 6px;
	box-sizing: border-box;
	cursor: pointer;
	vertical-align: top;
}

/deep/ .el-upload-list__item {
	background: #eef6ff !important;
	font-size: 16px;
}

.video-preview-box {
	margin-top: 20px;
}





.footer-actions {
	display: flex;
	justify-content: flex-end;
	justify-content: center;
	position: fixed;
	z-index: 100;
	bottom: 0;
	right: 0;
	left: 230px;
	padding: 10px;
	background: #fff;
	box-shadow: 0 0 1px 0 #ccc;
	// padding-right: 35px;
	margin-right: 18px;
}





// .el-radio-group.column {
//   display: flex;
//   flex-direction: column;
// }

.tip-input {
	margin-left: 20px;
	display: inline-block;
	max-width: 150px;
}

.time-divider {
	margin: 0 15px;
}

.page-wrap {
	.page-inner {}
}

.page-ctx-wrap {
	background: #fff;
	padding: 20px;
	border-radius: 6px;
}

.section-title {
	margin-bottom: 20px;
	width: 100%;
	height: auto;
	line-height: 46px;
	background: rgb(241, 242, 245);
	padding-left: 30px;
	font-size: 16px;
	font-weight: 600;
}

.panel-item {
	padding-bottom: 100px;
	// .flex();
	// flex-wrap: wrap;

	.input-item {
		margin-bottom: 20px;
		width: 100%;
		max-width: 800px;
		// width: 50%;

		&.hidden-item {
			display: none;
		}

		&:last-child {
			margin-bottom: 0;
		}

		.input-box {
			width: 100%;
			display: flex;
			align-items: flex-start;

			.label {
				height: 32px;
				line-height: 32px;
				min-width: 160px;
				min-width: 100px;
				text-align: right;
				margin-right: 40px;
				font-size: 20px;
				font-size: 14px;
				font-family: PingFang SC;
				color: #666666;

				&.required {
					position: relative;

					&:after {
						content: "*";
						color: #f00;
						position: absolute;
						right: -15px;
						top: 3px;
						// font-weight: bold;
					}
				}

				&.hidden {
					visibility: hidden;
				}
			}
		}

		//输入框组
		.inputs {
			.flex();

			.date-box {
				flex: 1;
			}

			.shuru-box {
				margin-left: 20px;
				flex: 4;
			}
		}

		.val {
			flex: 2;
			font-size: 20px;
			font-family: PingFang SC;
			color: #000000;

			.shuru {
				width: 100%;
				padding-left: 20px;
				outline: none;
				height: 40px;
				background: #ffffff;
				border: 1px solid #d4d8eb;
				border-radius: 4px;
				font-size: 16px;
			}

			.form-ele {
				.el-input {
					width: 100%;
				}

				.el-select {
					width: 100%;
				}

				.el-cascader {
					width: 100%;
				}
			}

			.input-tip {
				line-height: 32px;
				font-size: 14px;
				font-family: PingFang SC;
				color: #666;
			}
		}
	}
}

.loop-add {
	margin-top: 20px;
}
</style>